{extend name="light-year/layout/master/detail" /}

{block name="title"}管理员管理{/block}
{block name="page-title"}管理员{/block}

{block name="content"}
    <input name="admin_id" class="form-control" type="hidden" value="{if $detail}{$detail->admin_id}{/if}" />
    <div class="form-group">
        <label><span class="text-danger">*</span> 所属角色：</label>
        <div class="form-controls">
            <select name="role_id" class="form-control" required>
                <option value="0"> 请选择角色组 </option>
                {if !empty($roles)}
                    {foreach $roles as $role}
                        <option value="{$role->role_id}" {if $detail && $detail->role && $detail->role->role_id == $role->role_id}selected{/if} >{$role->role_name}</option>
                    {/foreach}
                {/if}
            </select>
        </div>
        <small class="help-block">
            <i class="mdi mdi-information"></i>
            请选择一个角色
        </small>
    </div>
    <div class="form-group">
        <label><span class="text-danger">*</span> 管理员名称：</label>
        <input type="text" class="form-control" name="admin_name" value="{if $detail}{$detail->admin_name}{/if}" placeholder="输入管理员名称" />
        <small class="help-block">
            <i class="mdi mdi-information"></i>
            唯一标识
        </small>
    </div>
    <div class="form-group">
        <label><span class="text-danger">*</span> E-mail：</label>
        <input type="email" class="form-control" name="admin_email" value="{if $detail}{$detail->admin_email}{/if}" placeholder="输入管理员邮箱" />
        <small class="help-block">
            <i class="mdi mdi-information"></i>
            请输入邮箱
        </small>
    </div>
    <div class="form-group">
        <label>
            登录密码：
        </label>
        <input type="text" class="form-control" name="password" value="" placeholder="输入登录密码" />
        <small class="help-block">
            <i class="mdi mdi-information"></i>
            {if $detail && $detail->password}
                已设置密码【再次输入，则会更改；不输入，则不变动】
            {else /}
                <span>尚未设置密码，<b class="text-danger">请设置密码！</b></span>
            {/if}
        </small>
    </div>
    <div class="form-group">
        <label>
            头像：
        </label>
        <div>
            <input type="hidden" name="admin_head">
            <div id="admin_head">
                <div id="admin_head_filePicker"><i class="icon-cloud-upload"></i></i> 选择单张图片</div>
            </div>
        </div>
    </div>
    <div class="form-group">
        <label>
            是否启用：
            <br/>
            <small class="text-success"><b>启用</b></small>
            才可以登录
        </label>
        <div class="clearfix">
            <label class="lyear-radio radio-inline radio-primary">
                <input type="radio" name="is_check" value="1" {if (empty($detail) || $detail->is_check === 1) }checked{/if}><span>启用</span>
            </label>
            <label class="lyear-radio radio-inline radio-primary">
                <input type="radio" name="is_check" value="0" {if (empty($detail) || $detail->is_check === 0) }checked{/if}><span>禁用</span>
            </label>
        </div>
    </div>
    <div class="form-group">
        <button type="submit" class="btn btn-primary ajax-post" target-form="add-form">确 定</button>
        <button type="button" class="btn btn-default" onclick="javascript:history.back(-1);return false;">返 回</button>
    </div>
{/block}

{block name="script-src"}
{/block}

{block name="script"}
<link rel="stylesheet" href="http://libs.itshubao.com/bootstrapvalidator/css/bootstrapValidator.min.css"/>
<script type="text/javascript" src="http://libs.itshubao.com//bootstrapvalidator/js/bootstrapValidator.min.js"></script>
{include file="light-year/layout:plugins/webuploader" /}

<script type="text/javascript">
    window.onload = function () {
        closeLayerLoading(closeAllLayer);

        // 图片上传组件
        webUploaderImgs('#admin_head_filePicker', '', '#admin_head', 'input[name=admin_head]', {'img_limit':1, 'single_graph_type':1});

        // 详情图片渲染（使用这种方式，可以共用图片上传限制等功能）
        let detail = JSON.parse('{:html_get_res_from_admin($detail)}');
        console.log(detail);
        if (detail && !isEmpty(detail.admin_head)){
            $('#admin_head').append(webUploaderImgHtml(detail.admin_head, 'input[name=admin_head]', $('#admin_head_filePicker').attr('span-class')));
        }

        // 表单验证
        $('#details').bootstrapValidator({
            excluded: [':disabled'],
            message: '该值无效',
            feedbackIcons: {
                valid: 'mdi mdi-check',
                invalid: 'mdi mdi-close',
                validating: 'mdi mdi-refresh'
            },
            fields: {
                'role_id': {
                    validators: {
                        notEmpty: {
                            message: '请选择所属角色！'
                        }
                    }
                },
                'admin_email': {
                    validators: {
                        notEmpty: {
                            message: '邮箱地址不能为空！'
                        },
                        emailAddress: {
                            message: '请输入正确的邮箱地址！'
                        },
                    }
                },
                'password': {
                    message: '密码无效！',
                    validators: {
                        stringLength: {
                            min: 6,
                            max: 30,
                            message: '密码长度必须大于6个字符且小于30个字符！'
                        }
                    }
                },
            }
        }).on('success.form.bv', function(e) {

        });
    }
</script>
{/block}